<template>
  <view>
    <login-before v-show="isShow"></login-before>
    <login-after v-show="!isShow"></login-after>
  </view>
</template>

<script>
import { mapState, mapGetters, mapMutations, mapActions } from "vuex";

import loginAfter from "../../components/login-after/login-after.vue";
import LoginBefore from "../../components/login-before/login-before.vue";

export default {
  components: { loginAfter, LoginBefore },
  data() {
    return {
      isShow: true,
      navIndex: 1,

      navList: ["选项卡一", "选项卡二", "选项卡三"],
      listIndex: 0,
    };
  },
  methods: {
    ...mapActions("moduleCommon", ["updateUserId"]),
    ...mapActions("moduleLoginAfter", [
      "getHistoryList",
      "getFavoritesList",
      "getCommentList",
      "getUserInfo",
    ]),
    checkIndex(index) {
      this.navIndex = index;
    },

    checkListIndex(index) {
      this.listIndex = index;
    },
  },
  async onShow() {
    const Authorization = uni.getStorageSync("Authorization");
    if (Authorization) {
      console.log("触发登录, 成功登录, Authorization");
      // 更新userId
      await this.updateUserId();
      // 获取用户信息
      this.getUserInfo();
      // 获取历史记录列表 发送网络请求
      this.getHistoryList();
      // 获取收藏列表 发送网络请求
      this.getFavoritesList();
      // 获取评论列表 发送网络请求
      this.getCommentList();
      this.isShow = false;
    } else {
      this.isShow = true;
    }
  },
};
</script>

<style lang="scss">
a {
  color: rgb(139, 139, 139);
}
a:hover {
  color: black;
}

.all {
  .dl {
    width: 100%;
    height: 400rpx;
    background-color: green;
    padding-top: 30px;
    .aa {
      width: 100%;
      height: 90rpx;
    }
    .dla {
      width: 370rpx;
      height: 100rpx;
      background-color: white;
      margin: 0 auto;
      border-radius: 35px;
      text-align: center;
      line-height: 100rpx;
      font-size: 32rpx;
      color: green;
    }
  }
}

.new-file {
  width: 100%;
  height: 600rpx;
  // background-color: chartreuse;
  border-radius: 35px 35px 0 0;
}

.head-nav {
  width: 50%;
  margin: 20rpx auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: rgb(139, 139, 139);
  // background-color: aqua;
}

.activite {
  font-weight: bold;
  border-bottom: 6rpx solid red;
  color: black;
  // background-color:red;
}

.head-nav > view {
  padding-bottom: 10rpx;
  // background-color: #0065d9;
}

.content {
  width: 100%;
  // height: 700rpx;
  // background-color: aquamarine;
  border-top: 1px solid rgb(241, 241, 241);
}
.a {
  width: 50%;
  height: 50rpx;
  // background-color: red;
  text-align: center;
  line-height: 50rpx;
  margin: 0 auto;
  font-size: 32rpx;
  margin-top: 50px;
}
.b {
  width: 50%;
  height: 50rpx;
  // background-color: red;
  text-align: center;
  line-height: 50rpx;
  margin: 0 auto;
  font-size: 30rpx;
  color: rgb(121, 121, 123);
  margin-top: 10rpx;
}
</style>
